<settings-screen>
    <div class="row">
        <div class="col-md-12">
          <p>
            <a href="query_snippets/new" class="btn btn-default"><i class="fa fa-plus"></i> New Snippet</a>
          </p>

          <table class="table table-border table-hover">
            <thead>
              <tr>
                <th>Trigger</th>
                <th>Description</th>
                <th>Snippet</th>
                <th>Created By</th>
                <th>Updated At</th>
              </tr>
            </thead>
            <tbody>
              <tr ng-repeat="snippet in $ctrl.snippets.getPageRows()">
                <td>
                  <a href="query_snippets/{{snippet.id}}">{{snippet.trigger}}</a>
                </td>
                <td>
                  {{snippet.description}}
                </td>
                <td>
                  {{snippet.snippet}}
                </td>
                <td>
                  <img ng-src="{{ snippet.user.profile_image_url }}" class="profile__image_thumb"/>
                  <span ng-class="{'text-muted': snippet.user.is_disabled}">{{snippet.user.name}}</span>
                </td>
                <td>
                  <span am-time-ago="snippet.created_at"></span>
                </td>
              </tr>
            </tbody>
          </table>
          <paginator paginator="$ctrl.snippets"></paginator>
        </div>
    </div>
</settings-screen>
